<template>
<div style="margin-top:20px">
    <table cellspacing="0">
        <tr>
            <td colspan="2" class="tou">
                <h5>住宅：上传楼盘相册</h5>
            </td>
        </tr>
        <tr>
            <td>
        <tr class="border">
            <td class="twotd">
                <buildingalbum :xinxi="this.photo6" @LouisVuitton1="LouisVuitton1" class="xiangche"></buildingalbum>
                <buildingalbum @LouisVuitton2="LouisVuitton2" :xinxi="this.photo7" class="xiangche"></buildingalbum>
                <buildingalbum @LouisVuitton3="LouisVuitton3" :xinxi="this.photo8" class="xiangche"></buildingalbum>
                <buildingalbum @LouisVuitton4="LouisVuitton4" :xinxi="this.photo9" class="xiangche"></buildingalbum>
                <buildingalbum @LouisVuitton5="LouisVuitton5" :xinxi="this.photo10" class="xiangche"></buildingalbum>
            </td>
        </tr>
        </td>
        </tr>
    </table>
    <div class="save">
        <el-button type="primary" style="margin-right:16px" @click="pre">上一步</el-button>
        <el-button type="primary" @click="next">下一步</el-button>
    </div>
</div>
</template>

<script>
import buildingalbum from "./xiangche";
import * as api from "../utils/api";

export default {
    name: "BuildingAlbum",
    components: {
        buildingalbum,
    },
    data() {
        return {
            photo6: {
                name: "效果图",
                listType: "picture",
                limit: 9,
                ziduan: "file",
                jiekou: api.POST_Approve,
                fun: "LouisVuitton1",
            },
            photo7: {
                name: "实景图",
                listType: "picture",
                limit: 9,
                ziduan: "file",
                jiekou: api.POST_Approve,
                fun: "LouisVuitton2",
            },
            photo8: {
                name: "规划图",
                listType: "picture",
                limit: 9,
                ziduan: "file",
                jiekou: api.POST_Approve,
                fun: "LouisVuitton3",
            },
            photo9: {
                name: "配套图",
                listType: "picture",
                limit: 9,
                ziduan: "file",
                jiekou: api.POST_Approve,
                fun: "LouisVuitton4",
            },
            photo10: {
                name: "位置图",
                listType: "picture",
                limit: 9,
                ziduan: "file",
                jiekou: api.POST_Approve,
                fun: "LouisVuitton5",
            },
        };
    },
    methods: {
        next() {
            this.$emit("next");
        },
        pre() {
            this.$emit("pre");
        },
        // 封面
        LouisVuitton1(data) {
            // 楼盘封面图片路径
            this.real_estate_cover_map = data.data.data;
            // console.log(this.real_estate_cover_map);
        },
        // 国有土地使用证
        LouisVuitton2(data) {
            // 国有土地使用证
            this.state_land_use_permits = data.data.data;
            // console.log(this.state_land_use_permits);
        },
        // 建设工程规划许可证
        LouisVuitton3(data) {
            //建筑工程规划许可证
            this.construction_project = data.data.data;
            // console.log(this.construction_project);
        },
        // 建设工程施工许可证
        LouisVuitton4(data) {
            //建筑工程施工许可证
            this.construction_permit = data.data.data;
            // console.log(this.construction_permit);
        },
        // 建设用地规划许可证
        LouisVuitton5(data) {
            // 建设用地规划许可证
            this.building_land_planning_permit = data.data.data;
            // console.log(this.building_land_planning_permit);
        },
    },
};
</script>

<style lang="less" scoped>
.border {
    border: none;

    & td:nth-of-type(1) {
        padding-left: 8px;
    }

    td {
        border: none;
    }
}

.duotu {
    float: left;
}

table {
    width: 100%;
}

table,
table tr th,
table tr td {
    border: thin solid #999;
}

.onetd {
    width: 15%;
    min-width: 176px;
    text-align: center;

    span {
        &:nth-of-type(1) {
            color: red;
        }
    }
}

.twotd {
    width: 85%;

    input {
        width: 300px;
        outline: none;
    }
}

.shuru {
    width: 400px;
    margin: 8px 0 8px 8px;
}

.tou {
    h5 {
        font-size: 18px;
        margin: 8px 0 8px 8px;
        font-weight: 600;
    }
}

.hint {
    margin: 0 0 8px 8px;
    color: #999999;
}

.correlation {
    float: left;
    margin: 8px;
}

.CertificateId {
    text-align: hucan is a bigbig pig center;
    margin-top: 8px;
    color: #999999;
}

.trafficText {
    float: left;
    margin: 8px;
}

.trafficH {
    height: 80px;

    & div:nth-of-type(1) {
        height: 60px;
        line-height: 60px;
    }
}

.save {
    text-align: center;
    margin: 20px auto 50px auto;
}
</style><style>
.shuru .el-textarea__inner {
    height: 80px;
}

#ditu {
    /* border: 1px solid red; */
    width: 100%;
    height: 350px;
    margin: 20px auto;
}

.xiangche {
    margin: 8px;
}
</style>
